

<template>
    <view class="addService">

        <view class="topBg"></view>
        <view class="topBg1"></view>

         <view style="position:fixed;top:0;width:750rpx;z-index:1000;" class="needChangeBg" :class="{active:!!transFormHeight}" :style="{height: systemInfo.statusBarHeight + 'px'}"></view>

         <view class="slim_header d-flex a-center j-center needChangeBg" :class="{active:!!transFormHeight}"  style="z-index:1000;background:transparent;border-bottom:none;"  :style="{top: systemInfo.statusBarHeight + 'px'}">
				<view class="left_box" @tap="goBack">
					<image src="/static/center/back.png" class="back"></image>
				</view>
				<view class="title">创建成功</view>
				<view class="right_box">
					<!-- <image src="/static/center/dian.png" class="dian"></image> -->
				</view>
		</view>
        <!-- <image
            class="psa"
            style="width:750rpx;height:834rpx;top:0;left:0;right:0;z-index:1;"
            src="../../static/bg1.jpg"
            mode=""
        ></image> -->

        <view
            class="content2 d-flex d-c a-center j-center"
            :style="{ top: `calc(100rpx + ${systemInfo.statusBarHeight}px)`}"
        >
            <image style="width:560rpx;height:560rpx;" src="/static/nodata1.png" mode="" />
            <text style="font-size:28rpx;color:#999;margin-top:40rpx;">创建群成功</text>
        </view>
    </view>


    <view class="bottom_box">
            <view class="btn btn1 d-flex a-center j-center" @tap="goGroup">进入群</view>
            <view class="btn btn2 d-flex a-center j-center" @tap="goBack">返回</view>
            <view class="heightBox"></view>
    </view>
</template>

<script setup lang="ts">
import { ref, computed,reactive,nextTick } from "vue";
import { onReady, onShow, onLoad,onUnload,onPageScroll } from "@dcloudio/uni-app";
import { userData as userDataStore } from "@/store/userData";
import { systemInfo as systemInfoStore } from "@/store/systemInfo";
import { addServiceHistory,getService } from "@/api/api";
import { handleJumpToChat } from "@/hooks/imHooks";

import { config as configStore } from "@/store/config";

onPageScroll(()=>{
})

let groupID = '';

const goBack = () => {
    uni.switchTab({
        url: "/pages/quanzi/quanzi",
    });
};

let tapLoading = false;

const goGroup = async()=>{
    if(tapLoading){
        return;
    }

    tapLoading = true

    const conversationId = `GROUP${groupID}`;
    
    await handleJumpToChat(conversationId).catch((err) => {
        uni.showToast({
                icon: "none",
                title: "跳转失败",
                duration: 1500,
            });
    });
}


const userData: any = userDataStore();

const systemInfo: any = systemInfoStore();

onReady(() => {});

onLoad((option: any) => {
    groupID = option.groupID;
    uni.$emit('createGroupSuccess');
});

const isEdit = ref(false);

onShow(()=>{
     tapLoading = false;
})

onUnload(() => {
     tapLoading = false;
});

onShow(() => {});
</script>

<style lang="scss" scoped>

.needChangeBg{
    transition:all linear .3s;
    background:transparent !important;
    &.active{
        background:#23e2a6 !important;
    }
}

.addService{
    width:750rpx;
    height:100vh;
    .content2{
        position:absolute;
        width:750rpx;
        left:0;
        right:0;
        bottom:240rpx;
    }
}


.bottom_box{
    width:750rpx;
    position:fixed;
    z-index:100;
    bottom:0;
    .heightBox{
        width:750rpx;
        min-height:20rpx;
        height:constant(safe-area-inset-bottom);
        height:env(safe-area-inset-bottom);
    }

    .btn{
            width: 690rpx;
            height: 80rpx;
            margin:0 auto;
            border-radius: 20rpx;
            font-size:32rpx;
            font-weight:600;
    }

    .btn1{
        background: linear-gradient(318deg, #64F1C5 0%, #29DBA3 100%);
        color:#fff;
        margin-bottom:20rpx;
    }
    .btn2{
        border: 2rpx solid #1DC691;
        color:#1DC691;
        margin-bottom:20rpx;
    }
}
</style>
